<template>
	<view class="all-box containers">
		<!-- 头部 -->
		<view class="Agent-header">
			<view class="Agent-header-left" @click="GoRyGl('userAdd')">
				<view class="Agent-header-left-top">
					总邀请注册数
				</view>
				<view class="Agent-header-left-num">
					{{data.number || 0}}
				</view>
				<view class="Agent-header-left-buttom">
					<text>
						今日新增 +{{data.dayCount || 0}}
					</text>
				</view>
			</view>
			<view class="Zj">

			</view>
			<view class="Agent-header-right" @click="GoRyGl('Billingdetails')">
				<view class="Agent-header-right-top">
					注册诊所销售金额统计
				</view>
				<view class="Agent-header-right-num">
					<text>￥</text>{{data.amount || 0}}
				</view>
				<view class="Agent-header-right-buttom">
					<text>
						查看明细
					</text>
				</view>
			</view>
		</view>
		<!-- 中间部分 -->
		<view class="Agent-Zj">
			<view class="" style="margin-right: 0;" @click="GoRyGl('settied')">
				<text class="iconfont ">&#xe667;</text>
				注册邀请
			</view>
			<view class="" @click="GoRyGl('personnel')">
				<text class="iconfont ">&#xe662;</text>
				人员管理
			</view>
			<view class="" style="margin-right: 0;" @click="useBook()">
				<text class="iconfont ">&#xe668;</text>
				使用说明
			</view>
			<view class="" @click="addpersonnel">
				<text class=" iconfont ">&#xe663;</text>
				新增人员
			</view>
		</view>
		<!-- 底下部分 -->
		<view class=" Agent-buttom">
			<view class="Agent-buttom-title">
				最近邀请注册
			</view>
			<view class="Agent-buttom-centent" v-for="item in data.list">
				<view class="left">
					<view class="name">
						{{item.company_name}}
					</view>
					<view class="time">
						{{item.create_time}}
					</view>
				</view>
				<view class="right">
					注册成功
				</view>
			</view>

		</view>
		<uni-popup ref="buyerModelX" type="center" custom="true">
			<view class="vipCard-box" @tap.stop="toVipCard()">
				<view class="imgx">
					<image :src="OSS_HOST+'img/demo-error.png'" mode="aspectFill"></image>
				</view>
			</view>
		</uni-popup>
		<!-- <New_personnel ref="personnel"></New_personnel> -->
		<uni-popup ref="buyerModel" type="center" custom="true"  :mask-click="false" >
			<view class="vipCard-box" @tap.stop="toVipCard()">
				<view class="img">
					<canvas v-if="qerF" style="width: 300px; height: 300px;margin:auto;margin-top: 44rpx;"
						canvas-id="myQrcode"></canvas>
				</view>
				<view class="close">
					<text class="iconfont" @tap.stop="Qclose()" style="font-size: 60rpx;">&#xe621;</text>
				</view>
			</view>
		</uni-popup>


	</view>
</template>
<script>
	// 骨架屏
	import tuiSkeleton from "@/components/tui-skeleton/tui-skeleton"
	// 气泡框
	// import bubblePopup from '@/components/tui-bubble-popup/tui-bubble-popup.vue'
	// 引入最下面的线
	// import tuiDivider from "@/components/divider/divider.vue"
	//下拉组件
	// import uniLoadMore from '@/components/uni-load-more.vue';
	// import tuiListCell from "@/components/list-cell/list-cell"
	// import uniPopup from '@/components/uni-popup/uni-popup.vue'
	// import tuiButton from '@/components/button/button.vue'
	// import hxNavbar from '@/components/hx-navbar/hx-navbar'
	// import New_personnel from "@/components/Newmessage/New_personnel"
	import drawQrcode from '@/utils/weapp.qrcode.esm.js'
	import Vue from 'vue'
	import jsCookies from '@/node_modules/js-cookie'
	import store from '@/store/index.js';
	import {
		oss_host
	} from '@/config/config.js';
	// 公共底部
	// import btabbar from '@/components/indexBottomTable/bottomtabbar.vue'
	import uniPopup from '@/components/uni-popup/uni-popup.vue'
	import {
		mapGetters
	} from 'vuex';

	// 按需加载
	export default {


		components: {
			// tuiModal,
			uniPopup,
			// btabbar,
			// tuiListCell,
			// tuiDivider,
			// uniLoadMore,
			// tuiButton,
			// bubblePopup,
			// tuiSkeleton,
			// New_personnel
		},
		data() {
			return {

				isTop: 0,
				navConfig: {
					// business-enter-nav.png
					backgroundImg: 'https://xoimg.aiouning.com/static/img/business-enter-nav.png',
					// title:'申请列表',
					color: '#fff',
					fontSize: 12,
					back: true,
					height: 55


				},

				// 图片链接站点
				OSS_HOST: oss_host,
				contentText: {
					contentdown: '上拉显示更多',
					contentrefresh: '正在加载...',
					contentnomore: '没有更多数据了',
					contentfirst: "暂无数据"
				},
				reason: '',
				check_estate: false,
				id: '',
				message: "",
				qerF: false,
				//接口数据
				data: {
					list: []
				},
				cartsListHeight: 400, //动态高度
				calcullateHeight: 400, //固定高度，计算需要
				current: 0,


				curr_page: 0,
				last_page: 0,


				// 骨架屏
				skeletonShow: true
			}
		},

		computed: {
			//注册网络状态
			...mapGetters(['netWorkType', 'loginStatus'])
		},
		onPageScroll: function(e) {

			if (e.scrollTop > 300) {
				this.isTop = 1
			} else {
				this.isTop = 0
			}
		},
		onLoad: function(e) {

			let that = this;

			//that.$refs.popupvLogin.open()
			//  高度自适应
			uni.getSystemInfo({
				success: function(res) {
					// console.log(res)
					let calc = res.windowHeight;
					that.winHeight = calc;
				}
			});
			//#ifdef  MP-WEIXIN
			that.navHeight = 44;
			//#endif


		},
		//页面初始
		onShow() {
			this.curr_page = 0
			this.getList()



		},
		onPullDownRefresh: function() {
			//下拉刷新的时候请求一次数据
			//console.log(11)
			this.curr_page = 0
			// this.loadingType = 3;				
			// this.getList();


		},
		onReachBottom: function() {
			//触底的时候请求数据，即为上拉加载更多
			//为了更加清楚的看到效果，添加了定时器
			//console.log(this.curr_page)

			if (this.curr_page >= this.last_page) {
				uni.showToast({
					icon: 'none',
					title: '没有更多数据'
				});

				return;
			}

			this.loadingType = 1;

		},

		methods: {
			refresh() {
				this.getList()
			},
			goBack(){
			   uni.navigateBack({ delta: 1 })
			 },
			getList() {
				const _this = this
				//提交ajax
				// console.log(1111)
				var opt = {
					url: '/assert/index',
					// data: {
					// 	page: _this.curr_page + 1
					// },
					success: function(res) {
						if (res.status == 1) {
							_this.data = res.data
						} else {
							uni.showToast({
								icon:'none',
								title:res.message,
								duration:3000,
								complete() {
									setTimeout((res) => { //未找到支付订单，继续推送信息
										_this.goBack()
									}, 3000);
									
								}
							})
							
						}

					}
				};
				this.$service.GetApi(opt) //网络	
			},
			useBook(){
				let _this = this
				_this.$refer.setVilit('/packageAgent/pages/usebook/usebook')
				let callback = function(url) {
					_this.$refs.popupvLogin.open()
				}
				let data = {
					type:1
				}
				_this.$refer.toUrl(callback, data)
			},
			GoRyGl(type) {
				let items = encodeURIComponent(JSON.stringify(this.data.info));
				if (type == 'settied') {

					uni.navigateTo({
						// url: '/packageAgent/pages/userAdd/userAdd'
						// url: "/packageAgent/pages/settied/settied"
						url: `/packageAgent/pages/settied/settied?obj=${items}`
					})

				} else if (type == 'userAdd' ) {
					
					uni.navigateTo({
						url: '/packageAgent/pages/userAdd/userAdd'
					})

				} else if (type == 'Billingdetails') {
					uni.navigateTo({
						url: '/packageAgent/pages/Billingdetails/Billingdetails'
					})

				} else if (type == 'personnel') {
					if(this.data.info.level>1){
						uni.showToast({
							icon: 'none',
							title: '无权限',
							duration: 1000
						})
						return;
					}
					uni.navigateTo({
						url: '/packageAgent/pages/personnel/personnel'
					})

					// this.$refs.buyerModelX.open()
					// setTimeout(() => {
					// 	this.$refs.buyerModelX.close()
					// }, 1000)

				}

			},

			addpersonnel() {
				let _this = this
				
				// console.log(this.data.info.level,111111111)
				if(this.data.info.level>1){
					uni.showToast({
						icon: 'none',
						title: '无权限',
						duration: 1000
					})
					return;
				}
				this.qerF = true
				this.$refs.buyerModel.open()
				uni.showToast({
					icon: 'none',
					title: '二维码生成中...',
					duration: 1000
				})
				setTimeout(() => {
					drawQrcode({
						width: 300, // 必须，二维码宽度，与canvas的width保持一致
						height: 300, // 必须，二维码高度，与canvas的height保持一致
						canvasId: 'myQrcode',
						background: '#ffffff', //	非必须，二维码背景颜色，默认值白色
						foreground: '#000', // 非必须，二维码前景色，默认值黑色 	'#000000'
						// ctx: wx.createCanvasContext('myQrcode'), // 非必须，绘图上下文，可通过 wx.createCanvasContext('canvasId') 获取，v1.0.0+版本支持
						text: 'https://cgapi.opportshop.com/wechat/addAssert/param/?assert_pid=' + _this.data
							.info.id + '&user_id=' + _this.data.info.user_id, // 必须，二维码内容
						// v1.0.0+版本支持在二维码上绘制图片
						image: {
							// imageResource: '../../images/icon.png', // 指定二维码小图标
							dx: 70,
							dy: 70,
							dWidth: 60,
							dHeight: 60
						}
					})
					// uni.navigateTo({
					// 	url: '/packageAgent/pages/adduserPage/adduserPage'
					// })
				}, 1000)
			},
			Qclose() {
				this.qerF = false
				this.$refs.buyerModel.close()
			},

		}
	}
</script>

<style lang="scss">
	@import "./AgentHome.scss";
</style>